<template>
	<div class="workexperience_info">
				<div class="Update_top" v-show="Update_top">
						<div class="workexperience_info_top">
						<div class="span_left">
							<span style="font-size: 20px;color: #FF9900;">|</span>
							<span>{{item.positione}}<!--web前端开发工程师助理--></span>
							<span style="font-size: 20px;">|</span>
							<span>{{item.company}}<!--武汉佰思杰科技有限公司--></span>
							<span>（{{item.time}}<!--2015.10 － 2016.10-->）</span>
						</div>
						<div class="span_right">
							<i-button  shape="circle" icon="ios-search" class="work_buttom_update" @click="UpdateWorkexperience($event)"></i-button>
							<i-button  shape="circle" icon="ios-remove" class="work_buttom_remove" @click="RemoveWorkexperience($event)"></i-button>
						</div>
						</div>
						<div  class="workexperience_info_adress">
							工作地点：
							<span>{{item.adress}}<!--深圳-龙华区--></span>
							<span>|</span>
							<span>月薪：</span>
							<span>{{item.money}}元/月*12个月</span>
						</div>
						<div class="workexperience_info_yeji">
							<div  class="workexperience_info_yeji1">
								职责业绩：
							</div>
							<div  class="workexperience_info_yeji2">
								{{item.performan}}
							</div>
						</div>
						<div class="workexperience_info_industry">
							公司行业：{{item.industry}}
						</div>
				</div>
				<div  class="_addbasic_data"  :v-show="Update_work">
					<div style="font-size: 17px;font-weight: 700;">编辑工作经历</div>
					<ul  class="add_work_experience">
						<li>
							公司名称：</span>
							<i-input v-model="wu_company" placeholder="请输入公司名称..." style="width: 86%"></i-input>
						</li>
						<li>
							公司行业：
							<i-input v-model="wu_industry" placeholder="请输入公司行业..." style="width: 86%"></i-input>
						</li>
						<li>
							职位名称：
							<i-input v-model="wu_positione" placeholder="请输入职位名称..." style="width: 86%"></i-input>
						</li>
						<li>
							<div class="work_experience1">
								<div class="work_experience11">
									工作地点：
								   <i-input  v-model="wu_adress" placeholder="请输入工作地点..." style="width: 72%"></i-input>
								</div>
								<div class="work_experience11">
									下属人数：
									<i-input  v-model="wu_num" placeholder="请输入下属人数..." style="width: 72%"></i-input>
								</div>
							</div>
						</li>
						<li>
							任职时间
							 <Row>
						        <Col span="12">
						            <DatePicker type="daterange" placement="bottom-end" placeholder="Select date" style="width: 86%"></DatePicker>
						        </Col>
						    </Row>
						</li>
						<li>
							<div class="workexperience_info_yeji_2">
								<div  class="workexperience_info_yeji1_2">
									职责业绩：
								</div>
								<div  class="workexperience_info_yeji222">
									 <Input  v-model="wu_performan" type="textarea" :rows="4" placeholder="请输入职责业绩..." />
								</div>
							</div>
						</li>
					</ul>
					<div class="basic_data_foot">
						<i-button type="primary" style="width: 100px; margin-right: 50px;"  @click="UdateSaveClick($event)">保存</i-button>
					    <i-button style="width: 100px;" @click="UdateCelClick($event)">取消</i-button>
					</div>
				</div>
			</div>
</template>
<script>
 import axios from 'axios'
	export default {
		name : 'WTest',
		props :{
			positione:Array
		},		
		data() {
			return {
				Update_top:true,
				Update_work:false,
				workexper:true,
				add_workexper:false,
				ListData:[],
				w_company:"",
            	w_industry:"",
            	w_positione:"",
            	w_adress:"",
            	w_num:"",
            	w_performan:"",
            	wu_company:"",
            	wu_industry:"",
            	wu_positione:"",
            	wu_adress:"",
            	wu_num:"",
            	wu_performan:""
			}
		},
		methods:{
			AddWorkexperience(){
            	this.workexper = false,
            	this.add_workexper = true,
            	this.w_company="",
            	this.w_industry="",
            	this.w_positione="",
            	this.w_adress="",
            	this.w_num="",
            	this.w_performan=""
           },
           UdateSaveClick(e){
           	    this.workexper = false,
				this.add_workexper = true,
				this.Update_top = false
           },
           UdateCelClick(e){
           		this.workexper = false,
				this.add_workexper = false,
				this.Update_top = true
           },
			handleInfoCancelClick(){
				this.workexper = true,
				this.add_workexper = false
			},
           UpdateWorkexperience(e){
           	    this.Update_top = false
           	    this.Update_work=true
           	    this.workexper = false
           	    this.add_workexper = false
            	axios.get('/static/mzx/detail.json').then(this.getCityInfoSucc)
           },
           RemoveWorkexperience(e){
           },
			getCityInfoSucc(res){
				res = res.data
				if(res.data){
					this.ListData = res.data.List
					this.wu_industry=this.ListData.company
					this.wu_company=this.ListData.company
	            	this.wu_industry=this.ListData.company
	            	this.wu_positione=this.ListData.company
	            	this.wu_adress=this.ListData.company
	            	this.wu_num=this.ListData.company
	            	this.wu_performan=this.ListData.company
				}
			}
		}
	}
</script>
<style>
	.work_buttom_update{
		float: right;position: relative;top: 2px;margin-right: 5px;
	}
	.work_buttom_remove{
		float: right;position: relative;top: 2px;
	}
	.span_left{
		width: 80%;
		display: -webkit-inline-box;
		text-overflow: ellipsis;
	    overflow: hidden;
	    white-space: nowrap;/*文本不换行*/
	}
	.span_right{
		width: 12%;
		display: -webkit-inline-box;
		float: right;
	}
	.basic_data_foot{
		padding-bottom: 30px;
	}
	.workexperience{
		border-bottom: 1px dashed;
		padding-bottom: 30px;
	}
	.workexperience_info_industry{
		padding-left: 30px;
		margin-bottom: 20px;
		font-size: 13px;
		color: #999999;
	}
	.workexperience_info_yeji{
		padding-left: 30px;
		margin-bottom: 15px;
		padding-bottom: 10px;
		position: relative;
	}
	.workexperience_info_yeji_2{
		width: 100%;
		display: inline-block;
		margin-bottom: 15px;
		border-bottom: 1px dashed;
		padding-bottom: 10px;
	}
	.workexperience_info_yeji1{
		width:12%;
		display: inline-block;
		position: absolute;
	}
	.workexperience_info_yeji1_2{
		width:12.5%;
		display: inline-block;
		position: relative;
	}
	.workexperience_info_yeji2{
		width: 85%;
		display: inline-block;
		margin-left: 15%;
	}
	.workexperience_info_yeji222{
		width: 85%;
		display: inline-block;
	}
	.workexperience_info_adress{
		padding-left: 30px;
	    margin-top: 15px;
	    margin-bottom: 15px;
	}
	.workexperience_info_top{
		padding-left: 30px;
		margin-top: 15px;
		background: #E6E6E6;
		font-weight: 700;
		font-size: 14px;
	}
	.Update_top{
		display: inline-block;
		width: 100%;
	}
</style>